import Vue from 'vue'
import VueRouter from 'vue-router'
import UserView from "../views/UserView";
import login from "@/views/login";
import AdminMainView from "@/views/AdminMainView";
import AdminHome from "@/views/AdminHome";
import UserData from "@/views/sys/UserData";
import axios from "axios";
import store from "../store"
import RoomData from "@/views/sys/RoomData";
import AdminIndex from "@/views/sys/AdminIndex";
import AdminUserCenter from "@/views/sys/AdminUserCenter";
import RecordedData from "@/views/sys/RecordedData";

Vue.use(VueRouter)

const routes = [
  {
    path: "/",
    name: "login",
    component: login
  },
  {
    path: "/UserView",
    name : "userView",
    component: UserView
  },
  {
    path: "/AdminHome",
    name: "adminHome",
    component: AdminHome,
    children:[
      {
        path: "/AdminMainView",
        name: "adminMainView",
        component: AdminMainView
      },
      {
        path: "/sys/UserData",
        name: "userData",
        component: UserData
      },
      {
        path: "/sys/RoomData",
        name : "roomData",
        component: RoomData
      },
      {
        path: "/sys/AdminIndex",
        name: "adminIndex",
        component: AdminIndex
      },
      {
        path: "/sys/AdminUserCenter",
        name : "adminUserCenter",
        component: AdminUserCenter
      },{
        path: "/sys/RecordedData",
        name: "recordedData",
        component: RecordedData
      }
    ]
  },
  {
    path: '/index',
    component: () => import('../views/Index.vue'),
     redirect: '/welcome',
    children: [{ path: '/welcome', component: () => import('../views/Welcome.vue') },
      { path: '/userCenter', component: () => import('../views/user/UserCenter.vue')},
      { path: '/book', component: () => import('../views/bookAndSignIn/Book.vue') },
      { path: '/quickBook', component: () => import('../views/bookAndSignIn/QuickBook.vue') },
      { path: '/cancelBook', component: () => import('../views/bookAndSignIn/CancelBook.vue') },
      { path: '/signIn', component: () => import('../views/bookAndSignIn/SignIn.vue') },
      { path: '/currentRecord', component: () => import('../views/bookRecord/CurrentRecord.vue') },
      { path: '/violateRecord', component: () => import('../views/bookRecord/ViolateRecord.vue') },
      { path: '/historyRecord', component: () => import('../views/bookRecord/HistoryRecord.vue') },
      { path: '/allRoom', component: () => import('../views/queryConferenceRoom/AllRoom.vue')},
      { path: '/availableRoom', component: () => import('../views/queryConferenceRoom/AvailableRoom.vue') },
    ]
  },
  {
    path: '/error',
    component: () => import('../views/Error.vue')
  }

]



const router = new VueRouter({
  mode: 'history',
  base: process.env.BASE_URL,
  routes
})

router.beforeEach((to, from ,next) =>{

  let hasRoute = store.state.menus.hasRoute

  if (!hasRoute){
    axios.get("/sys/menu/nav",{
      headers:{
        Authorization : localStorage.getItem("token")
      }
    }).then( res=>{
      store.commit("setMenuList",res.data.data.nav)

      store.commit("setPermList",res.data.data.authoritys)

      //动态绑定路由
      let newRoutes = router.options.routes
      res.data.data.nav.forEach(menu =>{
        if (menu.children){
          menu.children.forEach(e =>{

            //转化成路由
            let router =  menuToRoute(e)

            //把路由添加到路由管理中
            if (router){
              newRoutes[0].children.push(router)
            }
          })
        }
      })
      router.addRoutes(newRoutes)

      hasRoute = true
      store.commit("changeRouteStatus",hasRoute)
    })
  }

  next()
})


//导航转成路由
const menuToRoute =(menu) =>{
  if (!menu.component){
      return null
  }

  let route = {
    name:menu.name,
    path:menu.path,
    meta:{
      icon : menu.icon,
      title : menu.title
    }
  }
  route.component = () =>import('@/views/'+menu.component+'.vue')
  return route
}

export default router
